<template>
	<view>
		<headerNav></headerNav>
		<common-page>
			<!-- <u-image  mode="widthFix" width="100%"></u-image> -->
			<common-banner :src="banner"></common-banner>
			<common-content-wrapper>
				<round-card>
					<common-tabs :active="current" :tabs="tabs" @change="v => (current = v)"></common-tabs>

					<!-- 展示列表 -->
					<common-list-content>
						<view class="mt-5" v-for="item in items" :key="item.id" @tap="() => handleItemTap(item)">
							<list-item-image :title="item.name" :image="item.thumbimage">
								<view class="flex" v-if="item.tags" slot="extra">
									<text class="text-xs text-red">¥</text>
									<view>
										<text class="text-xl text-red">{{ item.tags[0].intro }}</text>
										<text class="text-sm">/{{ item.tags[0].title }}</text>
									</view>
								</view>
								<view class="flex-1 border-b border-b-gray border-b-solid">
									<view class="flex mt-2 item-start" v-for="(remark, index) in item.specification" :key="index">
										<view
											:class="[
												'border-box',
												'p-1',
												'flex',
												{ 'bg-red': '0' === remark.title, 'bg-purple': '1' === remark.title }
											]"
										>
											<u-image width="12" height="12" :src="imgurl + 'common/icon-star.png'" mode="widthFix"></u-image>
										</view>
										<view class="ml-1 text-xs text-gray-light">{{ remark.intro }}</view>
									</view>
								</view>
							</list-item-image>
						</view>
					</common-list-content>
				</round-card>
			</common-content-wrapper>
		</common-page>
		<aui-poster
			ref="poster"
			:mask="auiPoster.mask"
			:maskTapClose="auiPoster.maskTapClose"
			:image="auiPoster.image"
			@callback="auiPosterCallback"
		></aui-poster>
	</view>
</template>

<script>
import { imgurl } from '@/utils/constant.js'
import categoryMixin from '@/mixins/common-category-mixin.js'
import headerNav from '@/components/layout/headerNav.vue'
export default {
	mixins: [categoryMixin],
	data() {
		return {
			imgurl,
			auiPoster: {
				mask: true,
				maskTapClose: false,
				image: 'https://xbjz1.oss-cn-beijing.aliyuncs.com/upload/default/share.png'
			}
		}
	},
	methods: {
		handleItemTap(item) {
			uni.navigateTo({
				url: `/pages/financial/financial-detail?id=${item.id}`
			})
		},
		showPoster(e) {
			console.log(this.$refs)
			var _this = this
			_this.$refs.poster.show()
		},
		auiPosterCallback(e) {
			var _this = this
			console.log(e)
		}
	},
	components: {
		headerNav
	}
}
</script>

<style>
@import '@/common/aui/css/aui.css';
</style>
